window.onload = function(){

    let btn = document.querySelector("button");
    let btn_post = document.querySelector("#btn_post");
    btn.addEventListener('click', (e) => {
        e.preventDefault();

        let username = document.getElementById("username").value;
        let password = document.getElementById("password").value;
         
            // 用户端(原生)的fetch方式发送请求，提交表单
            fetch("http://172.19.1.251:8080/login", {
            method: 'GET',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
    }
    }).then((res) => {
        // 成功
        console.log("请求成功");
        // console.log()
        //res.json()//可以解析服务器返回的json格式的数据
        return res.text()//text()可以返回真正的数据,但此时得到的是Promise
    }).then((res)=>{
        console.log(res)
        return new Promise((resolve,reject)=>{
            console.log("演示继续")
        })
    }).then((res)=>{
        console.log(res)
    }).catch(() => {
        // 失败
        console.log("请求失败");
    })


    })

    btn_post.addEventListener('click', (e) => {
        e.preventDefault();

        let username = document.getElementById("username").value;
        let password = document.getElementById("password").value;
        let data = {
            username: username,
            password: password
        }
        let dataJson = JSON.stringify(data);
        console.log(dataJson);

        fetch("http://172.19.1.251:8080/login", {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
        },
        body: dataJson
    }).then((res) => {
        // 成功
        console.log("请求成功");
        console.log(res.text) 
    }).catch(() => {
        // 失败
        console.log("请求失败");
        })
    })


    }
    